{% extends 'base.html' %}
{% load static %}
{% block title %} 整改追踪列表 {% endblock %}

{% block content-wrapper %}
    <div class="content-wrapper">
        <div class="content">
            <div class="breadcrumb-wrapper">


            </div>
            <!-- First Row  -->
            <div class="row">
                <div class="col-lg-12">

                    <div class="card card-default">
                        <div class="card-header card-header-border-bottom">
                            <h2>整改项目列表</h2>
                        </div>
                        <div class="card-body">
                            <div class="row ">
                                <div class="col-sm-2">
                                    <ul class="nav nav-tabs nav-stacked flex-column">
                                        <li class="nav-item">
                                            <a href="#vtab1" class="nav-link active" data-toggle="tab"
                                               aria-expanded="true">
                                                <i class="mdi mdi-feather"></i> 整改追踪项目</a>
                                        </li>
                                        <li class="nav-item">
                                            <a href="#vtab2" class="nav-link" data-toggle="tab" aria-expanded="false">
                                                <i class="mdi mdi-lock"></i> 整改完成项目</a>
                                        </li>

                                    </ul>
                                </div>
                                <div class="tab-content col-sm-10 ">
                                    <div class="tab-pane fade active show" id="vtab1" aria-expanded="true">
                                            <div class="card-body">
                                            <table id="responsive-data-table" class="table dt-responsive nowrap"
                                                   style="width:100%">
                                                <thead>
                                                <tr>
                                                    <th>序号</th>
                                                    <th>项目名称</th>
                                                    <th>年度</th>
                                                    <th>状态</th>
                                                    <th>报告编号</th>
                                                    <th>报告名称</th>
                                                </tr>
                                                </thead>

                                                <tbody>
                                                {% for re_project in re_pr_project %}
                                                <tr>
                                                    <td>{{ forloop.counter }}</td>
                                                    <td><a href="{% url 'ex:re_problem' re_project.id %}">{{ re_project.project_name.project_name }}</a></td>
                                                    <td>{{ re_project.re_year }}</td>
                                                    <td>{{ re_project.get_re_status_display }}</td>
                                                    <td>{{ re_project.report_NO.notice_NO }}</td>
                                                    <td>{{ re_project.report_NO.notice_name }}</td>
                                                </tr>
                                                 {% endfor %}
                                                </tbody>

                                            </table>
                                            </div>

                                    </div>
                                    <div class="tab-pane fade" id="vtab2" aria-expanded="false">
                                        <div class="card-body">
                                            <table id="responsive-data-table2" class="table dt-responsive nowrap"
                                                   style="width:100%">
                                                <thead>
                                                <tr>
                                                    <th>序号</th>
                                                    <th>项目名称</th>
                                                    <th>年度</th>
                                                    <th>状态</th>
                                                    <th>报告编号</th>
                                                    <th>报告名称</th>
                                                </tr>
                                                </thead>

                                                <tbody>
                                                {% for re_project in re_fi_project %}
                                                <tr>
                                                    <td>{{ forloop.counter }}</td>
                                                    <td><a href="{% url 'ex:re_problem' re_project.id %}">{{ re_project.project_name.project_name }}</a></td>
                                                    <td>{{ re_project.re_year }}</td>
                                                    <td>{{ re_project.get_re_status_display }}</td>
                                                    <td>{{ re_project.report_NO.notice_NO }}</td>
                                                    <td>{{ re_project.report_NO.notice_name }}</td>
                                                </tr>
                                                 {% endfor %}
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>


    </div>

{% endblock %}

{% block myjs %}
    <pre class="mt-4">
    <script src="{% static 'assets/plugins/data-tables/jquery.datatables.min.js' %}"></script>
    <script src="{% static 'assets/plugins/data-tables/datatables.bootstrap4.min.js' %}"></script>
    <script src="{% static 'assets/plugins/data-tables/datatables.responsive.min.js' %}"></script>
    <link href="{% static 'assets/plugins/data-tables/datatables.bootstrap4.min.css' %}" rel="stylesheet">
    <link href="{% static 'assets/plugins/data-tables/responsive.datatables.min.css' %}" rel="stylesheet">
{#    <link href=""https://unpkg.com/sleek-dashboard/dist/assets/css/sleek.min.css">#}
    </pre>
    <script>
        jQuery(document).ready(function () {
            jQuery('#responsive-data-table').DataTable({
                "aLengthMenu": [[20, 30, 50, 75, -1], [20, 30, 50, 75, "All"]],
                "pageLength": 30,
                "dom": '<"row justify-content-between top-information"lf>rt<"row justify-content-between bottom-information"ip><"clear">'
            });
        });
        jQuery(document).ready(function () {
            jQuery('#responsive-data-table2').DataTable({
                "aLengthMenu": [[20, 30, 50, 75, -1], [20, 30, 50, 75, "All"]],
                "pageLength": 30,
                "dom": '<"row justify-content-between top-information"lf>rt<"row justify-content-between bottom-information"ip><"clear">'
            });
        });
    </script>

{% endblock %}

